<template>
    <div>
        <div class="content">
            <h3 style="text-align:center">{{startTime | filtersDatetime}}至{{endTime | filtersDatetime}}统计报表</h3>
            <h4 style="text-align:right;width: 1070px;margin: 0 auto;font-weight: 400;"><span>统计月度：{{startTime | filtersDatetime}}至{{endTime | filtersDatetime}}</span><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span>单位：TEU</span></h4>
            <table class="all-tab">
                <tr>
                    <td>类别</td>
                    <td colspan="2">类型</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.portName}}</td>
                </tr>
                <tr>
                    <td>装箱</td>
                    <td colspan="2">场站装箱</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.total}}</td>
                </tr>
                <!--<tr>
                    <td>厂外装箱</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.CZtotal}}</td>
                </tr>
                <tr class="td-bg">
                    <td>小计</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.CZXtotal}}</td>
                </tr>-->
                <tr class="td-bg2">
                    <td rowspan="3">拆箱</td>
                    <td colspan="2">港内掏箱</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.CXgn}}</td>
                </tr>
                <tr class="td-bg2">
                    <td colspan="2">整箱提运</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.CXzx}}</td>
                </tr>
                <tr class="td-bg">
                    <td colspan="2">小计</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.CXtotal}}</td>
                </tr>
                <tr>
                    <td rowspan="5">进口</td>
                    <td colspan="2">艘次</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.ivoyage}}</td>
                </tr>
                <tr>
                    <td rowspan="2">重箱</td>
                    <td>中转</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.iwaterTeu}}</td>
                </tr>
                <tr>
                    <td>非中转</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.inoWaterTeu}}</td>
                </tr>
                <tr>
                    <td colspan="2">空箱</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.iemptyTeu}}</td>
                </tr>
                <!--<tr>
                    <td>水转水</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.iwaterTeu}}</td>
                </tr>
                <tr>
                    <td>非水转水</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.inoWaterTeu}}</td>
                </tr>-->
                <tr class="td-bg">
                    <td colspan="2">理箱量</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.iTotal}}</td>
                </tr>
                <tr class="td-bg2">
                    <td rowspan="6">出口</td>
                    <td colspan="2">艘次</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.ovoyage}}</td>
                </tr>
                <tr class="td-bg2">
                    <td rowspan="3">重箱</td>
                    <td>港装</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.ogzteu}}</td>
                </tr>
                <tr class="td-bg2">
                    <td>厂装</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.oczteu}}</td>
                </tr>
                <tr class="td-bg2">
                    <td>中转</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.owaterTeu}}</td>
                </tr>
                <tr class="td-bg2">
                    <td colspan="2">空箱</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.oemptyTeu}}</td>
                </tr>
                <!--<tr class="td-bg2">
                    <td>水转水</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.owaterTeu}}</td>
                </tr>
                <tr class="td-bg2">
                    <td>非水转水</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.onoWaterTeu}}</td>
                </tr>-->
                <tr class="td-bg">
                    <td colspan="2">理箱量</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.oTotal}}</td>
                </tr>
                <tr>
                    <td rowspan="3">特殊作业</td>
                    <td colspan="2">熏蒸</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.xz}}</td>
                </tr>
                <tr>
                    <td colspan="2">二转</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.ez}}</td>
                </tr>
                <tr class="td-bg">
                    <td colspan="2">理箱量</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.xzTotal}}</td>
                </tr>
                <tr class="td-bg">
                    <td colspan="3">总艘次</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.totalV}}</td>
                </tr>
                <tr class="td-bg">
                    <td colspan="3">理重箱量</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.totalH}}</td>
                </tr>
                <tr class="td-bg">
                    <td colspan="3">理空箱量</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.totalE}}</td>
                </tr>
                <tr class="td-bg">
                    <td colspan="3">总理箱量</td>
                    <td v-for="(x,k) in tabelData" :key="k">{{x.totalAll}}</td>
                </tr>
            </table>
        </div>
    </div>
</template>
<script>
    import {
        getMonthTabRepZX,
        getMonthTabRepCX,
        getMonthTabRepIO,
        getMonthTabRepSP
    } from "@/api/shipPlan/shipPlan";
    export default {
        data() {
            return {
                tabelData: [],
                startTime: '',
                endTime: '',
                condition: {}
            }
        },
        mounted() {
            this.loadData2()
        },
        filters : {
            filtersDatetime(val){
                return new Date(val).getFullYear()+"年"+(new Date(val).getMonth()+1)+"月"+new Date(val).getDate()+"日"
            }
        },
        methods: {
            loadData2() {
                this.condition = JSON.parse(window.localStorage.MonthReportCondition)
                this.startTime = this.condition.search_GTE_dateTime
                this.endTime = this.condition.search_LTE_dateTime
                let params = JSON.parse(JSON.stringify(this.condition))
                params.search_IN_portCode = params.search_IN_portCode.join(',')
                getMonthTabRepZX(params).then(res => {
                    this.tabelData = res.data.GZ
                    for (let el of this.tabelData) {
                        let result = res.data.CZ.findIndex(ol => {
                            return el.portName === ol.portName
                        })
                        if (result !== -1) {
                            el.CZtotal = res.data.CZ[result].total
                            el.CZXtotal = el.total + el.CZtotal
                        }
                    }
                    getMonthTabRepCX(params).then(res => {
                        for (let el of this.tabelData) {
                            let result = res.data.PASS.findIndex(ol => {
                                return el.portName === ol.portName
                            })
                            if (result !== -1) {
                                el.CXzx = res.data.PASS[result].total
                            }
                            let result2 = res.data.CX.findIndex(ol => {
                                return el.portName === ol.portName
                            })
                            if (result !== -1) {
                                el.CXgn = res.data.CX[result2].total
                                el.CXtotal = el.CXzx + el.CXgn
                            }
                        }
                        getMonthTabRepIO(params).then(res => {
                            for (let el of this.tabelData) {
                                let result = res.data.Import.findIndex(ol => {
                                    return el.portName === ol.portName
                                })
                                if (result !== -1) {
                                    el.ivoyage = res.data.Import[result].voyage
                                    el.iheavyTeu = res.data.Import[result].heavyTeu
                                    el.iemptyTeu = res.data.Import[result].emptyTeu
                                    el.iwaterTeu = res.data.Import[result].waterTeu
                                    el.inoWaterTeu = res.data.Import[result].noWaterTeu
                                    el.iTotal = el.iwaterTeu + el.inoWaterTeu + el.iemptyTeu
                                }
                                let result2 = res.data.Export.findIndex(ol => {
                                    return el.portName === ol.portName
                                })
                                if (result2 !== -1) {
                                    el.oczteu = res.data.Export[result].czteu
                                    el.ogzteu = res.data.Export[result].gzteu
                                    el.ovoyage = res.data.Export[result].voyage
                                    el.oheavyTeu = res.data.Export[result].heavyTeu
                                    el.oemptyTeu = res.data.Export[result].emptyTeu
                                    el.owaterTeu = res.data.Export[result].waterTeu
                                    el.onoWaterTeu = res.data.Export[result].noWaterTeu
                                    el.oTotal = el.ogzteu + el.oczteu + el.owaterTeu + el.oemptyTeu
                                }
                            }
                            getMonthTabRepSP(params).then(res => {
                                let allAcc = {
                                    portName: '合计',
                                    total: 0,
                                    CZtotal: 0,
                                    CZXtotal: 0,
                                    CXgn: 0,
                                    CXzx: 0,
                                    CXtotal: 0,
                                    ivoyage: 0,
                                    iheavyTeu: 0,
                                    iemptyTeu: 0,
                                    iwaterTeu: 0,
                                    inoWaterTeu: 0,
                                    iTotal: 0,
                                    ovoyage: 0,
                                    ogzteu: 0,
                                    oczteu: 0,
                                    oheavyTeu: 0,
                                    oemptyTeu: 0,
                                    owaterTeu: 0,
                                    onoWaterTeu: 0,
                                    oTotal: 0,
                                    xz: 0,
                                    ez: 0,
                                    xzTotal: 0,
                                    totalV: 0,
                                    totalH: 0,
                                    totalE: 0,
                                    totalAll: 0,
                                }
                                for (let el of this.tabelData) {
                                    let result = res.data.XZ.findIndex(ol => {
                                        return el.portName === ol.portName
                                    })
                                    if (result !== -1) {
                                        el.xz = res.data.XZ[result].total
                                    }
                                    let result2 = res.data.EZ.findIndex(ol => {
                                        return el.portName === ol.portName
                                    })
                                    if (result2 !== -1) {
                                        el.ez = res.data.EZ[result].total
                                        el.xzTotal = el.xz + el.ez
                                    }
                                    el.totalV = el.ivoyage + el.ovoyage
                                    el.totalH = el.iheavyTeu + el.oheavyTeu
                                    el.totalE = el.iemptyTeu + el.oemptyTeu
                                    el.totalAll = el.totalH + el.totalE
                                    allAcc.total = allAcc.total + el.total
                                    allAcc.CZtotal = allAcc.CZtotal + el.CZtotal
                                    allAcc.CZXtotal = allAcc.CZXtotal + el.CZXtotal
                                    allAcc.CXgn = allAcc.CXgn + el.CXgn
                                    allAcc.CXzx = allAcc.CXzx + el.CXzx
                                    allAcc.CXtotal = allAcc.CXtotal + el.CXtotal
                                    allAcc.ivoyage = allAcc.ivoyage + el.ivoyage
                                    allAcc.iheavyTeu = allAcc.iheavyTeu + el.iheavyTeu
                                    allAcc.iemptyTeu = allAcc.iemptyTeu + el.iemptyTeu
                                    allAcc.iwaterTeu = allAcc.iwaterTeu + el.iwaterTeu
                                    allAcc.inoWaterTeu = allAcc.inoWaterTeu + el.inoWaterTeu
                                    allAcc.iTotal = allAcc.iTotal + el.iTotal
                                    allAcc.ovoyage = allAcc.ovoyage + el.ovoyage
                                    allAcc.ogzteu = allAcc.ogzteu + el.ogzteu
                                    allAcc.oczteu = allAcc.oczteu + el.oczteu
                                    allAcc.oheavyTeu = allAcc.oheavyTeu + el.oheavyTeu
                                    allAcc.oemptyTeu = allAcc.oemptyTeu + el.oemptyTeu
                                    allAcc.owaterTeu = allAcc.owaterTeu + el.owaterTeu
                                    allAcc.onoWaterTeu = allAcc.onoWaterTeu + el.onoWaterTeu
                                    allAcc.oTotal = allAcc.oTotal + el.oTotal
                                    allAcc.xz = allAcc.xz + el.xz
                                    allAcc.ez = allAcc.ez + el.ez
                                    allAcc.xzTotal = allAcc.xzTotal + el.xzTotal
                                    allAcc.totalV = allAcc.totalV + el.totalV
                                    allAcc.totalH = allAcc.totalH + el.totalH
                                    allAcc.totalE = allAcc.totalE + el.totalE
                                    allAcc.totalAll = allAcc.totalAll + el.totalAll
                                }
                                this.tabelData.push(allAcc)
                                this.$nextTick(() => {
                                    window.print()
                                    window.close()
                                })
                            })
                        })
                    })
                })
            }
        }
    }

</script>
<style lang="scss" scoped>
    .content {
        width: 100%;
    }

    .all-tab {
        border-collapse: collapse;
        width: 1070px;
        margin: 20px auto;
        margin-top: 0;

        tr {
            height: 40px;
            font-size: 14px;
        }
    }

    .all-tab tr td {
        border: 1px solid #dcdfe6;
        text-align: center;
    }

    .td-bg {
        background: #f1faff;
        font-weight: bold;
    }

    .td-bg2 {
        background: #fafafa;
    }

    .title-font {
        color: #409EFF;
        font-size: 13px;
    }

</style>
